window.onload = function(){
    //配置
    var config = {
        vx: 4,//点x轴速度,正为右，负为左
        vy:  4,//点y轴速度
        height: 2,//点高宽，其实为正方形，所以不宜太大
        width: 2,
        count: 100,//点个数
        color: "100, 100, 100",//点颜色
        stroke: "50,50,50",//线条颜色
        dist: 6000,//点吸附距离
        e_dist: 20000,//鼠标吸附加速距离
        max_conn: 10//点到点最大连接数
    }
    //调用
    CanvasParticle(config,'MyDiv');
}


// 移入扫码测试，下拉出一个二维码
function QRcode(){
    let span=document.querySelector(".banner .banner-right .test .saoma")
    let div=document.querySelector(".banner .banner-right .test .saoma div")
    span.addEventListener("mouseenter",function(){
        div.style.height="120px"
    })
    span.addEventListener("mouseleave",function(){
        div.style.height="0"
    })
}
QRcode()


//点击时，小对号对应切换，下面收费也对应切换
function clickTime(){
    let span=document.querySelectorAll(".banner .banner-right .test .iteam")
    let price=document.querySelectorAll(".banner .banner-right p:nth-child(5) span")
    span.forEach((i,j) => {
        i.addEventListener("click",function(){
            span.forEach((k) => {
                k.classList.remove("left-small-bar")
            });
            i.classList.add("left-small-bar")
            price[0].textContent=i.getAttribute("ss")
            price[1].textContent=i.getAttribute("unit")
        })
    });
}
clickTime()


//main 部分点击切换样式
function columns(){
    let span=document.querySelectorAll("main .information .columns .title span")
    let lis=document.querySelectorAll("main .information .uthentication-left li")
    span.forEach((i,j) => {
        i.addEventListener("click",function(){
            span.forEach((k) => {
                k.classList.remove("active")
            });
            i.classList.add("active")
            lis.forEach((k) => {
                k.classList.remove("on")
            });
            lis[j].classList.add("on")
        })
    });
}
columns()